import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'AnimatedOpacity Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: AnimatedOpacityDemo(),
    );
  }
}

class AnimatedOpacityDemo extends StatefulWidget {
  @override
  _AnimatedOpacityDemoState createState() => _AnimatedOpacityDemoState();
}

class _AnimatedOpacityDemoState extends State<AnimatedOpacityDemo> {
  // 控制透明度的变量
  double _opacity = 1.0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("AnimatedOpacity Demo")),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            // 使用 AnimatedOpacity 控件
            AnimatedOpacity(
              opacity: _opacity,
              duration: Duration(seconds: 2), // 动画过渡时间
              child: Container(
                width: 100,
                height: 100,
                color: Colors.blue,
                child: Center(
                  child: Text(
                    "Hello World!",
                    style: TextStyle(color: Colors.white, fontSize: 20),
                  ),
                ),
              ),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  // 切换透明度
                  _opacity = _opacity == 1.0 ? 0.0 : 1.0;
                });
              },
              child: Text("Toggle Opacity"),
            ),
          ],
        ),
      ),
    );
  }
}
